<template>
  <div id="fixedDisk">
    <el-radio-group size="mini" v-model="activeName">
      <el-radio-button @click.native="getList(1)" label="1">河内五</el-radio-button>
      <el-radio-button @click.native="getList(2)" label="2">澳洲五</el-radio-button>
    </el-radio-group>
    <!-- 同步 -->
    <!-- <div class="synchronous">
      <el-button size="mini">同步</el-button>
    </div>-->
    <!-- 列表 -->
    <div style="margin-top:20px">
      <!-- 标题 -->
      <tableheader></tableheader>
      <div class="fix-content">
        <el-table
          border
          el-table-column
          size="mini"
          class="table-width"
          :data="tableData"
          :header-cell-style="{background:'#ccc'}"
        >
          <el-table-column prop="name" label="一字定"></el-table-column>
          <el-table-column prop="betsMin" label></el-table-column>
          <el-table-column prop="betsMax" label></el-table-column>
          <el-table-column prop="itemMax" label></el-table-column>
          <el-table-column prop="difficulty" label></el-table-column>
          <el-table-column prop="odds" label></el-table-column>
          <el-table-column prop="updateBy" label></el-table-column>
          <el-table-column prop="updateTime" label></el-table-column>
          <el-table-column prop="operation">
            <template slot-scope="scope">
              <el-button @click="Modify(scope.row)" size="mini" type="primary">修改</el-button>
            </template>
          </el-table-column>
        </el-table>
      </div>
    </div>

    <!-- 修改 -->
    <el-dialog title="修改" :visible.sync="pushShow" width="400px" :before-close="cancel">
      <!-- 最小下注 -->
      <div class="bet">
        <div>最小下注：</div>
        <el-input size="mini" style="width:180px" v-model="Minimum" placeholder="请输入最小下注"></el-input>
      </div>
      <div class="bet">
        <div>单注上限：</div>
        <el-input size="mini" style="width:180px" v-model="limit" placeholder="请输入单注上线"></el-input>
      </div>
      <div class="bet">
        <div>单项上限：</div>
        <el-input size="mini" style="width:180px" v-model="Individual" placeholder="请输入单项上限"></el-input>
      </div>
      <div class="bet">
        <div>赔率：</div>
        <el-input size="mini" style="width:180px" v-model="Odds" placeholder="请输入赔率"></el-input>
      </div>
      <div class="bet">
        <div>中奖率：</div>
        <el-input size="mini" style="width:180px" v-model="Chance" placeholder="请输入中奖率"></el-input>
      </div>

      <div class="bet" style="margin-top:30px">
        <el-radio v-model="radio" label="1">备选项</el-radio>
        <el-radio v-model="radio" label="2">备选项</el-radio>
      </div>
      <!-- 确定 -->
      <div class="bet" style="margin-top:30px">
        <el-button @click="buy" size="mini" type="primary">确认</el-button>
        <el-button size="mini">默认按钮</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import tableheader from "../../../components/tableheader";
import { getList } from "@/api/table";
import { categoryConfig, update } from "@/api/user";
import qs from "qs";
export default {
  components: {
    tableheader
  },
  data() {
    return {
      radio: "1",
      input: "",
      pushShow: false,
      activeName: 1,
      currentPage: 1,
      tableData: [],
      typeid: "1",
      id: "",
      Minimum:"",//最小
      limit:"",//单注
      Individual:"",//单项
      Odds:"",//赔率
      Chance:"",//中奖率

    };
  },

  created() {
    this.getList(this.activeName);
  },

  methods: {
    // 拉取

    getList(type) {
      this.typeid = type;
      let data = qs.stringify({
        module: this.typeid
      });
      categoryConfig(data).then(res => {
        console.log(res.data, "列表");
        if (res.data.code == 200) {
          if (this.typeid == 1) {
            this.tableData = res.data.data.yiziding;
          } else {
            this.tableData = res.data.data.erziding;
          }
        } else {
          this.$message.error(res.data.msg);
        }
      });
    },
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`);
    },
    // 修改弹框
    Modify(row) {
      
      let that = this;
      that.id = row.id;
      console.log(that.id, 8787878);

      let data = qs.stringify({
        id: that.id,
        odds:that.Odds,
        betsMin:that.Minimum,
        betsMax:that.limit,
        itemMax:that.Individual

      });
      update(data).then(res => {
        console.log(res.data, "列表ID");
        if (res.data.code == 200) {
          that.pushShow = true;
        } else {
          that.$message.error(res.data.msg);
        }
      });
      // this.pushShow = true;
    },
    cancel() {  
      this.$message({
        type: "info",
        message: "已关闭"
      });

      this.pushShow = false;
    },
    buy(){
       let data = qs.stringify({
        id: this.id,
        odds:this.Odds,
        betsMin:this.Minimum,
        betsMax:this.limit,
        itemMax:this.Individual

      });
      update(data).then(res => {
        console.log(res.data, "列表ID");
        if (res.data.code == 200) {
          this.getList();
          this.pushShow = false;
        } else {
          this.$message.error(res.data.msg);
        }
      });
      // this.getList();
    }
  }
};
</script>
<style lang="less" scoped>
#fixedDisk {
  margin-top: 20px;
  margin-left: 20px;
  overflow: scroll;
  .synchronous {
    margin-top: 20px;
  }
}
.base {
  width: 100%;
  height: 30px;
  border: 1px solid #999999;
  background: #ffffff;
}
.fix-content {
  max-height: 500px;
}
.el-table__empty-block {
  display: none !important;
}
.table-width {
  min-width: 880px;
}

.bet {
  display: flex;
  justify-content: center;
  padding-top: 10px;
  div:nth-child(1) {
    flex: 0.5;
    margin-top: 5px;
  }
}
</style>